<template>
	<uni-popup ref="addPay_pop">
		<view class="addpay">
			<view class="addpay_1">
				新增收付款方式
			</view>
			<view class="close1" @click="close()">关闭</view>
			<template v-for="(item,index) in list">
				<view class="addpay_item" @click="selecttItem(item)">
					<image class="left1" :src="item.url"></image>
					<view class="text11">{{item.name}}</view>
					<uni-icons type="right" size="15" color="#BDB4B4"></uni-icons>
				</view>
			</template>

		</view>
	</uni-popup>
</template>

<script>
	export default {
		props: {
			success: {
				type: Function,
			}
		},
		name: "addPayType",
		data() {
			return {
				list: [{
						type: 'alipay',
						name: '支付宝',
						url: '/static/tading/alipay.png'
					},
					{
						type: 'wechat',
						name: '微信',
						url: '/static/tading/wechat.png'
					},
					{
						type: 'bank',
						name: '银行卡',
						url: '/static/tading/bank.png'
					},
					{
						type: 'usdt',
						name: 'USDT',
						url: '/static/tading/usdt.png'
					},
					{
						type: 'rmb',
						name: '数字人民币',
						url: '/static/tading/rmb.png'
					}
				]
			};
		},
		methods: {
			open() {
				this.$refs.addPay_pop.open('bottom')
			},
			close() {
				this.$refs.addPay_pop.close()
			},
			selecttItem(item) {
				this.success(item)
				this.close()
			}
		}
	}
</script>

<style scoped lang="less">
	.addpay {
		background: #FFFFFF;
		border-radius: 28rpx 28rpx 0px 0px;
		padding: 10px 0px 180px 0px;

		.addpay_1 {
			text-align: center;
			font-size: 32rpx;
			font-weight: 800;
			color: #2A2A2A;
			padding: 10px;

		}

		.addpay_item {
			// border-bottom: 2rpx solid #ECECEC;
			border-top: 1rpx solid #ECECEC;
			padding: 15px 10px;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.left1 {
				width: 30px;
				height: 30px;

			}

			.text11 {
				flex: 1;
				font-size: 28rpx;
				font-weight: 400;
				color: #333333;
				margin-left: 10px;
			}
		}

		.close1 {
			position: absolute;
			right: 20px;
			top: 20px;
			font-size: 28rpx;
			font-weight: 400;
			color: #969696;
		}


	}
</style>